<!--
 * @Date: 2020-04-14 14:50:44
 * @LastEditors: 黄栋
 * @LastEditTime: 2020-04-17 13:19:34
 * @FilePath: /cloudAdmin/src/views/sale/order/orderInfo.vue
 -->
<template>
  <div>
    <el-card>
      <div slot="header" class="clearfix">
        <el-breadcrumb separator-class="el-icon-arrow-right">
          <el-breadcrumb-item :to="{ path: '/personerOrder' }">订单管理</el-breadcrumb-item>
          <el-breadcrumb-item>订单详情</el-breadcrumb-item>
        </el-breadcrumb>
      </div>
      <div>
        商品信息
        <el-table :data="orderInfo.list">
          <el-table-column prop="total_price" label="产品">
            <template slot-scope="{row}">
              {{row.title}}
              <el-image
                style="width:30px;height:30px;vertical-align:middle;"
                :src="row.thumb"
                :preview-src-list="[row.thumb]"
              ></el-image>
            </template>
          </el-table-column>
          <el-table-column prop="price" label="单价"></el-table-column>
          <el-table-column prop="goods_option" label="规格"></el-table-column>
          <el-table-column prop="number" label="数量"></el-table-column>
          <el-table-column prop="number" label="订单状态">
            <template slot-scope="{row}">{{row.is_refund==0?'正常':row.is_refund==1?'退款申请中':'已完成'}}</template>
          </el-table-column>
        </el-table>
        <el-row style="padding:10px;margin:10px 0;background:#D1DFF5">
          <el-col :span="4">收货地址</el-col>
          <el-col :span="20">
            <div>{{orderInfo.name}} {{orderInfo.phone}}</div>
            <div>{{orderInfo.address}}</div>
          </el-col>
        </el-row>
        <el-form size="mini">
          <el-row :gutter="10">
            <el-col :span="12">
              <el-card header="订单信息">
                <el-form-item label="订单编号">{{orderInfo.out_trade_no}}</el-form-item>
                <el-form-item label="买家ID">{{orderInfo.users_id}}</el-form-item>
                <el-form-item
                  label="支付状态"
                >{{orderInfo.type==1?'未支付':orderInfo.type==2?' 预支付':orderInfo.type_2==3?'已支付':'已关闭'}}</el-form-item>
                <el-form-item label="创建时间">{{orderInfo.create_time}}</el-form-item>
                <el-form-item label="下单时间">{{orderInfo.pay_time}}</el-form-item>
                <el-form-item
                  label="订单状态"
                >{{orderInfo.type_2==1?'已支付':orderInfo.type_2==2?'已发货':orderInfo.type_2==3?'已收货':'未支付'}}</el-form-item>
              </el-card>
            </el-col>
            <el-col :span="12">
              <el-card header="买家付款信息">
                <el-form-item label="产品邮费">{{orderInfo.total_postage}}</el-form-item>
                <!-- <el-form-item label="支付方式">{{orderInfo.total_postage}}</el-form-item> -->
                <el-form-item label="订单总价">{{orderInfo.total_price}}</el-form-item>
                <el-form-item label="村贝抵扣">{{orderInfo.integral_price}}</el-form-item>
                <el-form-item label="店铺优惠">{{orderInfo.coupon_price}}</el-form-item>
                <el-form-item label="会员优惠">{{orderInfo.discount_price}}</el-form-item>
                <el-form-item label="实付款">{{orderInfo.pay_price}}</el-form-item>
              </el-card>
            </el-col>
            <el-col :span="12">
              <el-card header="订单分成信息">
                <el-form-item label="服务费比例">{{orderInfo.service}}</el-form-item>
                <el-form-item label="服务费金额">{{orderInfo.service_price}}</el-form-item>
                <el-form-item label="分销商">{{orderInfo.yiji_name}}</el-form-item>
                <el-form-item label="奖励金额">{{orderInfo.yiji}}</el-form-item>
                <el-form-item label="合伙人">{{orderInfo.hehuo_name}}</el-form-item>
                <el-form-item label="分账金额">{{orderInfo.hehuo_price}}</el-form-item>
                <!-- <el-form-item label="店铺获得金额">{{orderInfo.total_postage}}</el-form-item> -->
                <!-- <el-form-item label="店铺获得村积分">{{orderInfo.total_postage}}</el-form-item> -->
              </el-card>
            </el-col>
          </el-row>
        </el-form>
      </div>
    </el-card>
  </div>
</template>

<script>
import {
  get_order_co_list,
  get_order_co_info,
  add_tracking,
  get_order_express
} from "@/utils/api/sale";
import { mapState, mapActions } from "vuex";
export default {
  computed: {
    ...mapState({
      logisticList: state => state.config.logisticList,
      company: state => state.company,
      users_id: state => state.user.id
    })
  },
  data() {
    return {
      orderInfo: {}
    };
  },
  activated() {
    // console.log();
    this.getOrderInfo(this.$route.query.id);
  },
  methods: {
    getOrderInfo(id) {
      get_order_co_info({
        users_id: this.users_id,
        co_id: this.company.id,
        co_order_id: id
      }).then(res => {
        if (res.code == 200) {
          console.log(res);
          this.orderInfo = res.data;
        }
      });
    }
  }
};
</script>

<style>
</style>